import React, { memo, useEffect, useState } from 'react'
import Scroll from '@/baseUI/scroll'
import {List} from './ClassifyScrollBar.style'
import CommodityItem from '@/components/commodityItem/CommodityItem'
import ClassifyScroll from '../classifyScroll/ClassifyScroll'

function ClassifyScrollBar(props) {
    const {classifyList,classifyIndex,classifyListData} = props
    const {setClassifyIndex}=props

    return (
        <div style={{"background":'white'}}>
                <ClassifyScroll classifyList={classifyList} setClassifyIndex={setClassifyIndex} classifyIndex={classifyIndex} />
            <List>
                {
                    classifyListData.map((item)=><CommodityItem CommodityData={item} key={item.id} />)
                }
            </List>
        </div>
    )
}

export default memo(ClassifyScrollBar)
